$(function () {
    var currentPage = 1;
    var pageSize = 5;

    //  1-一进入页面，请求第一屏的数据并渲染 
    render();
    function render() {
        $.ajax({
            url: '/category/queryTopCategoryPaging',
            type: 'get',
            data: {
                page: currentPage,
                pageSize: pageSize
            },
            dataType: 'json',
            success: function (info) {
                console.log(info);      
                //渲染
                $('tbody').html(template('tmp', info));
                //进行分页
                $('#paginator').bootstrapPaginator({
                    bootstrapMajorVersion: 3, //版本
                    currentPage: currentPage, // 当前选中的页码
                    totalPages: Math.ceil(info.total / info.size),
                    onPageClicked: function (_, _, _, page) {
                        //记录当前页
                        currentPage = page;
                        //渲染点击的页面
                        render();
                    }
                });
            }
        })
    }


    //2-验证一级分类名称不能为空
    $('#form').bootstrapValidator({
        //1. 指定不校验的类型，默认为[':disabled', ':hidden', ':not(:visible)'],可以不设置
        excluded: [':disabled', ':hidden', ':not(:visible)'],

        //2. 指定校验时的图标显示，默认是bootstrap风格
        feedbackIcons: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
        //验证字段
        fields: {
            categoryName: {
                //验证规则
                validators: {
                    notEmpty: {
                        message: '一级分类名称不能为空'
                    }
                }
            }
        }
    });

    //3-点击提交按钮并且数据验证通过的情况下，向后台发送ajax请求（阻止submit默认行为），提交数据
    $('#form').on('success.form.bv', function (e) {
        //阻止默认行为
        e.preventDefault();
        //通过ajax提交数据
        $.ajax({
            url: '/category/addTopCategory',
            type: 'post',
            data: $('#form').serialize(),
            dataType: 'json',
            success: function (info) {
                console.log(info);    
                //添加成功 模态框隐藏 页面重新渲染第一页 （可以看到最新的数据），重置表单 
                if (info.success) {
                    // 隐藏模态框
                    $('#addModal').modal('hide');
                    // 渲染第一页
                    currentPage = 1;
                    render();
                    // 重置模态框
                    // 只能重置验证的样式，不能重置内容
                    // $('#form').data('bootstrapValidator').resetForm();
                    // 能重置验证的样式，还能能重置内容
                    $('#form').data('bootstrapValidator').resetForm(true);

                }
            }
        });
    })
});